var gulp = require('gulp');
var sass = require('gulp-sass');
var postcss = require('gulp-postcss');
var px2rem = require('postcss-px2rem');
var browserSync = require('browser-sync').create();
var del = require('del');


gulp.task('start', function () {
  console.log('编译开始');
})

gulp.task('server', function () {
  browserSync.init({
    server: {
      baseDir: './dist'
    }
  });
  gulp.watch('src/html/*.html', ['html']);
  gulp.watch('src/static/**/*', ['static']);
  gulp.watch('src/sass/*.scss', ['css']);
  gulp.watch('dist/*.html').on('change', browserSync.reload);
});

gulp.task('html', function () {
  return gulp.src('src/html/*.html').pipe(gulp.dest('dist'))
})

gulp.task('css', function () {
  var processors = [px2rem({remUnit: 75})];
  return gulp.src('src/sass/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(postcss(processors))
    .pipe(gulp.dest('dist/static/css'));
});

gulp.task('js', function () {
  return gulp.src('src/js/**.js').pipe(gulp.dest('dist/static/js'))
})

gulp.task('static', function () {
  return gulp.src('src/static/**').pipe(gulp.dest('dist/static'))
})

gulp.task('clean', function (){
  return del(['dist']);
})

gulp.task('default', ['start', 'html', 'css', 'js', 'static', 'server'], function () {
  console.log('this is default!');
});